<template>
  <div>
    <img :src="imageUrl" alt="公告图片" class="image-style" />
    <h2>{{originalForm.tital}}</h2>
    <p>{{originalForm.content}}</p>

    <p>{{dateInfo.name}} 在 {{originalForm.createTime}} 发布的公告</p>
  </div>
</template>

<script>
export default {

  data() {
    return {
      originalForm: {},

      dateInfo: {}
    };
  },

  methods: {
    queryById() {
      this.$axios.get("api/Announcement/queryById/" + this.id).then(res => {
        if (res.data.code == 200) {
          this.originalForm = res.data.data; // 使用this来引用data()中的originalForm
          this.imageUrl = this.originalForm.imgSrc; // 可以直接从this.originalForm中获取imgSrc
        }
      });
    },
    queryById1() {
      this.$axios.get("api/employee/queryById/" + this.userId).then(res => {
        if (res.data.code == 200) {
          console.log("公告: ", res.data.data.name);
          this.dateInfo = res.data.data;
        }
      });
    }
  },
  created() {
    this.userId = window.localStorage.getItem("userId");
    this.queryById1();
    if (this.$route.query.id) {
      this.id = this.$route.query.id;
      this.queryById();
    } else {
      console.error("The id is undefined.");
    }
  }
};
</script>

<style>
.image-style {
    width: 400px;
    height: 400px;
} 
</style>